<template>
  <el-dialog title="推送日志" :visible.sync="dialogVisible" :before-close="handleClose" width="90%">
    <div class="d-flex ai-center">
      <div>
        房源编号
        <span style="margin-left: 10px">{{model.shulanHouNum}}</span>
      </div>
      <div style="margin-left: 20px">
        楼盘信息
        <span style="margin-left: 10px">
          <span>{{model.resblockName}} |</span>
          <span>{{ model.room?model.room + "室" : "" }}</span>
          <span v-if="model.room">{{ (model.hall || 0) + "厅" }}</span>
          <span>{{ (!model.room && !model.hall)? "未填户型": "" }}</span>
          <span>| {{ (model.buildSize!=-1&&model.buildSize)? model.buildSize + "㎡" : "未填面积" }}</span>
          <span
            v-if="model.delegationType != 'SALES'"
          >| {{model.totalPrices > 0 ? model.totalPrices + "元 /月" : "未填价格"}}</span>
          <span
            v-if="model.delegationType == 'SALES'"
          >| {{model.totalPrices > 0 ? model.totalPrices / 10000 + "万" : "未填价格"}}</span>
        </span>
      </div>
    </div>

    <el-table
      v-loading="loading"
      border
      highlight-current-row
      :data="tableList"
      style="margin-top: 20px"
    >
      <el-table-column
        v-for="(item, index) in tableTitles"
        :key="index"
        :label="item.title"
        :width="item.width"
        align="center"
      >
        <template slot-scope="{row}">
          <template v-if="item.key=='title'">{{row.houDelVO[item.key]}}</template>
          <template v-else-if="item.key=='pushStatus'">
            <div v-if="row.pushStatus=='T'">推送中</div>
            <div v-if="row.pushStatus=='S'">推送成功</div>
            <div v-if="row.pushStatus=='F'">推送失败</div>
          </template>
          <template v-else-if="item.isList">
            <div v-for="(innerItem, i) in row[item.key]" :key="i">{{innerItem}}</div>
          </template>
          <template v-else>{{item.format ? item.format(row[item.key]) : row[item.key]}}</template>
        </template>
      </el-table-column>
    </el-table>

    <!-- 分页 -->
    <el-row type="flex" justify="end">
      <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="queryParams.page"
        :limit.sync="queryParams.pageSize"
        @pagination="getList"
      />
    </el-row>
  </el-dialog>
</template>

<script>
import { pushLogList } from "@/api/user";
import comTitleItem from "../com/com-title-item";
import pagination from "@/components/Pagination";
import platform from "@/config/house/platform";
import { parseDate } from "@/filters";

export default {
  components: {
    comTitleItem,
    pagination,
  },
  props: {
    houDelId: {
      type: String,
      default: "",
    }
  },
  data() {
    return {
      loading: false,
      dialogVisible: true,
      total: 0,
      tableList: [],
      model: {},
      queryParams: {
        page: 1,
        pageSize: 10,
      },
      tableTitles: [
        { title: "推送房源", width: 0, key: "title" },
        { title: "推送网站", width: "120", key: "portType" },
        { title: "推送账号", width: "120", key: "account" },
        { title: "外网房源ID", width: "100", key: "portHouKey" },
        { title: "推送设置", width: "150", key: "pushSetResult", isList: true },
        {
          title: "推送时间",
          width: "180",
          key: "pushTime",
          format: (v) => parseDate(v),
        },
        { title: "推送状态", width: "100", key: "pushStatus" },
        { title: "日志", width: "200", key: "pushResult", isList: true },
      ],
    };
  },
  async mounted() {
    this.getList({ page: 1 });
  },
  methods: {
    async getList({ page }) {
      this.loading = true;

      const { content } = await pushLogList({
        page,
        pageSize: this.queryParams.pageSize,
        delId: this.houDelId,
      });
      this.total = content.total || 0;

      content.list.forEach((item) => {
        item.portType = platform[item.portType];
      });

      this.tableList = content.list;
      if (content.list.length) {
        const houDelVO = content.list[0].houDelVO;
        houDelVO.delegationType = "SALES";
        this.model = houDelVO;
      }

      this.loading = false;
    },

    handleClose(done) {
      this.$emit("oncloselog");
    },
  },
};
</script>

<style scoped>
.pagination-container {
  padding: 0;
}
</style>